<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>上传图片</title>
<script type="text/javascript" src="Public/js/fancyUpload/js/mootools.js"></script>
<script type="text/javascript" src="Public/js/fancyUpload/js/Fx.ProgressBar.js"></script>
<script type="text/javascript" src="Public/js/fancyUpload/js/Swiff.Uploader.js"></script>
<script type="text/javascript" src="Public/js/fancyUpload/js/FancyUpload3.Attach.js"></script>
<script type="text/javascript">
var filzesize='{$MaxFileSize}';
window.addEvent('domready', function() {
 
	/**
	 * Uploader instance
	 */
	var up = new FancyUpload3.Attach('demo-list', '#demo-attach, #demo-attach-2', {
		path: 'Public/js/fancyUpload/js/Swiff.Uploader.swf',
		//url: 'showcase/script.php',
		url: '?m=Admin&a=uploadFile',
		//url: $('form-demo').action,
		fileSizeMax: filzesize * 1024 *1024,
		typeFilter: {
		    'Images (*.jpg, *.jpeg, *.gif, *.png)': '*.jpg; *.jpeg; *.gif; *.png'
		},
		verbose: true,
 
		onSelectFail: function(files) {
			files.each(function(file) {
				new Element('li', {
					'class': 'file-invalid',
					events: {
						click: function() {
							this.destroy();
						}
					}
				}).adopt(
					new Element('span', {html: file.validationErrorMessage || file.validationError})
				).inject(this.list, 'bottom');
			}, this);	
		},
 
		onFileSuccess: function(file) {
			//new Element('input', {type: 'checkbox',name:'wenjian[]','checked': true}).inject(file.ui.element, 'top');
			file.ui.element.highlight('#e6efc2');
		},
 
		onFileError: function(file) {
			file.ui.cancel.set('html', 'Retry').removeEvents().addEvent('click', function() {
				file.requeue();
				return false;
			});
 
			new Element('span', {
				html: file.errorMessage,
				'class': 'file-error'
			}).inject(file.ui.cancel, 'after');
		},
 		
		onFileRequeue: function(file) {
			file.ui.element.getElement('.file-error').destroy();
 
			file.ui.cancel.set('html', '取消').removeEvents().addEvent('click', function() {
				file.remove();
				return false;
			});
 
			this.start();
		}
 
	});
 
});
</script>
<style>
a.hover {
	color: red;
}
 
#demo-list {
	padding: 0;
	list-style: none;
	margin: 0;
}
 
#demo-list .file-invalid {
	cursor: pointer;
	color: #514721;
	padding-left: 48px;
	line-height: 24px;
	background: url(Public/js/fancyUpload/assets/error.png) no-repeat 24px 5px;
	margin-bottom: 1px;
}
#demo-list .file-invalid span {
	background-color: #fff6bf;
	padding: 1px;
}
 
#demo-list .file {
	line-height: 2em;
	padding-left: 22px;
	background: url(Public/js/fancyUpload/assets/attach.png) no-repeat 1px 50%;
}
 
#demo-list .file span,
#demo-list .file a {
	padding: 0 4px;
}
 
#demo-list .file .file-size {
	color: #666;
}
 
#demo-list .file .file-error {
	color: #8a1f11;
}
 
#demo-list .file .file-progress {
	width: 125px;
	height: 12px;
	vertical-align: middle;
	background-image: url(Public/js/fancyUpload/assets/progress-bar/progress.gif);
}
.style2 {font-size: 14px;
	font-weight: bold;
	color: #345BA4;
}
body{font-size:12px;}
</style>
</head>
<body>
<div>
<form action="?m=Admin&m=imageSave" method="post" enctype="multipart/form-data" id="form-demo" >
<a href="#" id="demo-attach">上传文件</a>
 
<ul id="demo-list"></ul>
 
<a href="#" id="demo-attach-2" style="display: none;">上传文件</a>

</form>
</div>
</body>
</html>